@import '../../../App.scss';
p{
  margin: 0;
  padding: 0;
}
#DjradioBanner {
  display: flex;
  .swiper_box {
    width: 100%;
    position: relative;
    .swiper_item {
      height: 174px;
      ul {
        display: flex;
        flex-wrap: wrap;
        list-style: none;
        li {
          cursor: pointer;
          @include size(70px, 72px);
          margin: 0 33px 20px 0;
          &:nth-of-type(9n+9) {
            margin-right: 0;
          }
          @include flexCenter();
          flex-direction: column;
          .img {
            @include size(48px);
            background-size: 96px 48px !important;
            background-position-x: 0px;
          }
          font-size: 12px;
          color: #888;
          border-radius: 6px;
          &:hover {
            background: #eee;
          }
        }
        .li_act {
          border: 2px solid #d35757;
          color: #d35757;
        }
      }
    }
    .postion {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      cursor: pointer;
    }
    .btn_swiper_left {
      @extend .postion;
      left: -30px
    }
    .btn_swiper_right {
      @extend .postion;
      right: -30px;
    }
    .ant-carousel .slick-dots-bottom {
      bottom: -20px;
    }
    .ant-carousel .slick-dots li.slick-active button {
      background: rgb(163, 2, 2);
    }
    .ant-carousel .slick-dots li button {
      background: #999;
      @include size(8px);
      border-radius: 50%;
      color: transparent;
    }
    .ant-carousel .slick-dots li.slick-active {
      width: 16px;
    }
  }
}